<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>用车申请</title>
    <script src="/assets/js/config.js"></script>
    <link rel="stylesheet" type="text/css" href="css/apply.css"/>
</head>
<body>
<form id="fm">
    <h2 align=" center" id="title">用车申请单</h2>
    <p>申请日期： <span id="crtDate"></span></p>
    <table border="1" style="border-collapse: collapse;width: 100%">
        <tr>
            <td>姓名</td>
            <td><input class="layui-input" name="userName"></td>
            <td>部门</td>
            <td><input class="layui-input" name="department"></td>

        </tr>
        <tr>
            <td>用车时间</td>
            <td>
                <input class="layui-input" name="startTime" id="datePicker">
            </td>
            <td>预计还车时间</td>
            <td>
                <input class="layui-input" name="endTime" id="datePicker">
            </td>
        </tr>
        <tr>
            <td>用车原因</td>
            <td colspan="5"><input class="layui-textarea" name="reason"></td>
        </tr>
    </table>
    <br>
</form>
</body>
<script type="text/javascript" src="js/design.js"></script>
<script type="text/javascript" src="js/multiSelect.js"></script>
<script>
    layui.use('laydate', function(){
        var laydate = layui.laydate;
        //同时绑定多个
        lay('#datePicker').each(function(){
            laydate.render({
                elem: this,
                type: 'datetime',
                trigger: 'click'
            });
        });
    });
    $(function () {
        var id = getUrlParam();
        if (id) {
            //审批进入
            drawApprove(id);
            $("input").prop('readonly', true);
            $("#app").hide();
            $(".layui-layer-btn").hide();
            //查询流程详情
            $.post('/office/flowStepInstance/queryDetail', {id: id}, function (res) {
                if (res.code == 200) {
                    var data = res.obj;
                    drawForm(data, $("#fm"))
                    $("#crtDate").text(formatDate(new Date(data.crtDate)));
                }
            });
        } else {
            //新建流程
            drawAdd();
            var today = formatDate(new Date())
            $("#crtDate").text(today);
            $("[name='userName']").val(getUserName());
            $("[name='department']").val(getOrgName());
            //渲染流程审批节点
            $.post('/office/flowStepTemplate/getTemplateStep', {userId: getUserId(), templateId: 11}, function (res) {
                if (res.code == 200) {
                    if (res.obj) {
                        drawFlowStep(res.obj.flowNodes);
                    }
                }
            })
        }
    });
    function submitForm() {
        var param = getSubmitParam();
        if (!validateCommonForm()) {
            showAlert("请补全表单详情后提交哦");
            return false;
        }
        if(new Date(param.startTime)>=new Date(param.endTime)){
            showAlert("开始时间不得大于归还时间！");
            return false;
        }
        layer.confirm('确认提交', function (index) {
            param.userId = localStorage.getItem("userId");
            param.title = $("#title").text();
            doSubmit('/office/flowWork/addCarFlow', param)
        })
    }
</script>

</html>